<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false"%>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>三峡大学小书屋-商品详情页</title>
    <link rel="stylesheet" href="../../resource/css/main.css">
    <link rel="stylesheet" href="../../resource/css/reset.css">
    <script type="text/javascript" src="../../resource/js/jquery-1.9.1.min.js"></script>

</head>
<body style="background:url(../../resource/images/22.jpg) ;-webkit-background-size: cover;background-size:cover;">
<div class="header_con">
    <div class="header">
        <div class="welcome" style="font-size: 15px;">欢迎来到三峡大学小书屋!</div>
        <div class="user_login" style="color: black;">
            用户名：${sessionScope.username}

            <span>|</span>
            <a href="forcart.do?uid=${sessionScope.uid}" style="color: black;" style="font-size: 15px;">我的购物车</a>
        </div>
    </div>
</div>

<div class="search_bar clearfix">
    <a href="#" class="logo fl"><img src="../../resource/images/logo.png" style="width: 250px;height: 58px;"></a>
    <div class="search_con fl">
        <input type="text" class="input_text fl" placeholder="  搜索商品">
        <input type="button" class="input_btn fr" value="搜索">
    </div>
</div>
<div class="navbar_con">
    <div class="navbar clearfix">
        <div class="subnav_con fl">
            <h1>商品详情 <i></i></h1>
        </div>
        <ul class="navlist fl">
            <li><a href="toIndex.do">首页</a></li>
            <li><a href="forcart.do?uid=${sessionScope.uid}">购物车</a></li>
        </ul>
    </div>
</div>
<div class="submena clearfix">
    <a href=" ">全部分类</a>
    <span>></span>
    <a href=" ">娱乐书籍</a>
    <span>></span>
    <a href=" ">商品详情</a>
</div>
<div class="center_con clearfix">
    <div class="main_menu fl"><img src="${requestScope.products.imgurl}" style="height: 370px;width: 350px;"> </div>
    <div class="goods_detail_list fr">
        <h3 style="color: white;font-weight: bold;">${requestScope.products.pname}</h3>
        <p style="color: white;">${requestScope.products.pdesc}</p>
        <div class="prize_bar">
            <div class="show_prize fl">￥<em>${requestScope.products.price}元</em></div>
        </div>
        <div class="goods_num clearfix">
            <div class="num_name fl" style="color: white;font-size: 15px;">数量：</div>
            <div class="num_add fl">
                <input type="text" class="num_show fl" value="1" style="background-color: rgba(248,248,255,0.7);color: black;">
                <a href="javascript:;" class="add fr">+</a>
                <a href="javascript:;" class="minus fr">-</a>
            </div>
        </div>
        <div class="total" style="color: white;font-size: 15px;">总价：<em>${requestScope.products.price}元</em></div>
        <div class="operate_btn">
            <a href="insertcart.do?pid=${requestScope.products.pid}&uid=${sessionScope.uid}" class="add_cart">加入购物车</a>
        </div>
    </div>
</div>

<script type="text/javascript" src="../../resource/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    var $add_x = $('#add_cart').offset().top;
    var $add_y = $('#add_cart').offset().left;

    var $to_x = $('#show_count').offset().top;
    var $to_y = $('#show_count').offset().left;

    $(".add_jump").css({'left':$add_y+80,'top':$add_x+10,'display':'block'})
    $('#add_cart').click(function(){
        $(".add_jump").stop().animate({
                'left': $to_y+7,
                'top': $to_x+7},
            "fast", function() {
                $(".add_jump").fadeOut('fast',function(){
                    $('#show_count').html(2);
                });

            });
    })
</script>

</body>
</html>
